<template>
    <view class="wo-page u-padding-20" v-if="pageInit">
        <view class="wo-page-body u-padding-20">
			<view class="wo-title u-text-center">
				<text>预约详情</text>
			</view>
            <u-cell-group class="u-margin-bottom-20">
				<u-cell-item title="预约接种点" :value="dataDetail.hospital.name"></u-cell-item>
				<u-cell-item title="预约名称" :value="dataDetail.product.name"></u-cell-item>
				<u-cell-item title="预约时段" v-if="dataDetail.product.mode_type == 1" :value="dataDetail.product.mode_setting[dataDetail.time_id].name"></u-cell-item>
				<u-cell-item title="接种人" :value="dataDetail.person.name"></u-cell-item>
				<u-cell-item title="身份证" :value="dataDetail.person.id_number"></u-cell-item>
			</u-cell-group>
            <view class="u-flex">
            	<view class="u-flex-6 u-padding-right-10">
            		<u-button type="primary" shape="circle" @click="$u.route('pages/index')">返回首页</u-button>
            	</view>
				<!--
				<view class="u-flex-6 u-padding-left-10">
					<u-button type="warning" shape="circle" @click="$u.route('pages/person/update', {id: dataDetail.id})">修改信息</u-button>
				</view>
				-->
            </view>
		</view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            dataDetail: {},
		};
    },
    methods: {
        // 页面初始化
        async initPageFunc(option) {
            let id = option.id || 0;
            if (!id) {
                return false;
            }
            let dataDetail = await this.$u.api.productOrderDetail({
                id: id
            });
            if (!dataDetail) {
                return false;
            }
            this.dataDetail = dataDetail;
            this.pageInit = true;
        }
    }
};
</script>

<style lang="scss">
.wo-page-body {
    background-color: #fff;
    border-radius: uni-unit(10px);
	.wo-title {
		height: uni-unit(35px);
		font-size: uni-unit(18px);
		line-height: uni-unit(35px);
	}
}
</style>
